<!-- toaster directive -->
<toaster-container toaster-options="{'position-class': 'toast-top-right', 'close-button':true}"></toaster-container>
<!-- / toaster directive -->

<!-- 导航条 -->
<div class="bg-white bread-crumb">
    <ul class="breadcrumb b-a m-b-n-xs lter b-b wrapper-md">
        <li><a ui-sref="main"><i class="fa fa-home"></i> 首页</a></li>
        <li><a ui-sref="main.authm.cardAuth.inAndOutlist">门禁管理</a></li>
        <li class="active" ng-bind="title"></li>
    </ul>
</div>
<div ng-show="loading" class="text-center m-t-md text-lg dataWarn"><i class="fa fa-spin fa-spinner"></i> 数据加载中...</div>
<!-- 内容区域 -->
<div class="wrapper-md content">
    <div class="panel panel-default">
        <!-- 头部 -->
        <div class="panel-heading font-bold" style="margin: 0;padding: 0;">
            <span>&nbsp; </span>
            <a class="btn btn-sm btn-icon btn-rounded btn-default pull-right m-t-n-xs"
               ui-sref="main.authm.cardAuth.inAndOutlist"><i
                    class="text-md glyphicon glyphicon-chevron-up text-muted"></i></a>
        </div>

        <div class="panel-body" id="none-bgc">
            <form class="form-horizontal" name="user_form">
                <span class="text-danger wrapper-sm person-Info">人员信息</span>
                <!--人员名-->
                <table class="table">
                    <tr>
                        <td>姓名：</td>
                        <td ng-bind="record.personName"></td>
                        <td>民族：</td>
                        <td ng-bind="record.nation"></td>
                    </tr>
                    <tr>
                        <td>性别：</td>
                        <td>
                            <span ng-show="record.sex == '1' ">男</span>
                            <span ng-show="record.sex == '2' ">女</span>
                        </td>
                        <td>身份证号：</td>
                        <td ng-bind="record.IDCardNo"></td>
                    </tr>

                    <tr>
                        <td>出生日期：</td>
                        <td ng-bind="record.birthday"></td>
                        <td>户籍地址：</td>
                        <td ng-bind="record.censusAddress"></td>
                    </tr>
					<tr ng-show="projectId=='2'">
                        <td>学号：</td>
                        <td ng-bind="record.studentNo"></td>
                        <td></td>
                        <td></td>
                    </tr>
                </table>

                <span class="text-danger wrapper-sm person-Info">刷卡信息</span>

                <table class="table">
                    <tr>
                        <td>房屋地址：</td>
                        <td ng-bind="record.address"></td>
                        <td>刷卡时间：</td>
                        <td ng-bind="record.inOutTime"></td>
                     
                    </tr>

                    <tr ng-show="projectId !=='2'">
                        <td>卡      号：</td>
                        <td ng-bind="record.authNo"></td>
                        <td>卡类型：</td>
                        <td class="v-middle">
                            <span ng-show="record.authType == '0'">身份证</span>
                            <span ng-show="record.authType == '4' ">居住证</span>
                            <span ng-show="record.authType == '5' ">IC卡</span>
                        </td>
                    </tr>
                    <tr>
                        <td>开门状态：</td>
                        <td ng-bind="record.stateStr"></td>
                        <td></td>
                        <td></td>
                       
                    </tr>
                </table>

                <div ng-show="record.isIntegratedVideo=='1'">
                    <p style="font-size: 15px;margin: 15px 0 15px 15px;">开门记录图片：</p>
                    <!--app或者室内开门图片-->
                    <ul  class="imgul clearfix" ng-show="farawayOpen">
                        <li ng-repeat="item in pageInfo">
                            <img ng-src="{{'http://183.232.65.202:8765/putFile/putImge?key='+item}}" alt="">
                        </li>
                    </ul>
                    <!--室内按钮或者刷卡开门（base64）-->
                    <ul  class="imgul clearfix" ng-show="nearOpen">
                        <li ng-repeat="item in result.data track by $index">
                            <img ng-src="data:image/png;base64,{{item}}" alt="">
                        </li>
                    </ul>

                    <div class="videoBox" ng-show="hasVideo">
                        <p style="font-size: 15px;margin: 15px 0 15px 15px;">开门记录视频：</p>
                        <div class="videoparent">
                            <video ng-src="{{videoKey}}"controls="controls" ng-style="myStyle"></video>
                        </div>
                    </div>

                </div>
               
            </form>
        </div>
    </div>

    <style scoped="scoped">
        .table{
            margin: 0;
        }
        .table tr td:nth-child(odd){width: 12%}
        .table tr td:nth-child(2n){width: 38%}
        #none-bgc {
            background-color: #fff;
            padding: 0;
            margin: 0;
            position: relative;
        }

        #none-bgc .form-horizontal .person-Info {
            font-size: 17px;
            color: #777;
            line-height: 60px
        }

        #none-bgc .form-horizontal .table tr td:nth-child(1) {
            padding-left: 30px;
        }

        #none-bgc .form-horizontal .table tr td {
            line-height: 35px;
        }

        #none-bgc .form-horizontal .table tr:nth-last-child(1) {
            border: 1px solid #dee5e7;
        }

        .app-content-body .content {
            margin-top: 44px;
        }
        .imgul,.videoBox{
            list-style: none;
            overflow: hidden;
            border-bottom: none;
            margin: 0;
            padding: 0;
        }
       .videoparent{
        width: 80%;
        margin:0 auto;
       }
        .videoparent video {
            width: 100%;
            height: 600px;
        }
        .imgul li{
            list-style: none;
            width:30%;
            margin:0 0 2% 2.5%;
            float: left;
        }
        .imgul li img{
            max-width: 100%;
        }
        .plusImg img{
            max-width: 100%;
        }

    </style>